﻿<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>jQuery电商包邮城市选择代码 - 站长素材</title>

<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" href="css/RegionalChoice.css" />

</head>
<body>

<div class="form-group">
	<label class="col-sm-2 control-label text-right">不参与单品包邮地区</label>
	<div class="col-sm-9 col-xs-12">
		<div id="areas" class="form-control-static"></div>
		<a href="javascript:;" class="btn btn-default" data-toggle="modal" data-target="#myModal">添加不参加满包邮的地区</a>
		<input type="hidden" id="selectedareas" name="edareas" value="">
		<span class="help-block">如果设置0或空，则不支持满件包邮</span>
	</div>
</div>

<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					选择区域
				</h4>
			</div>
			<div class="modal-body">
				<div class="test-div">
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭
				</button>
				<button type="button" class="btn btn-primary btntest1">
					确定
				</button>
			</div>
		</div>
	</div>
</div>

<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/RegionalChoice.js"></script>
<script>
$(function () {
	//------生成地区
	GetRegionPlug();
	//------选择后确定按钮
	$(".btntest1").click(function () {
		var areas = GetChecked().join(",");//已选择的城市名
		$("#areas").html(areas);//显示在页面
		$("#selectedareas").val(areas);//存入隐藏的input
		$('#myModal').modal('hide');//完后隐藏模态框
	})
})
</script>

</body>
</html>